<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@include file="/WEB-INF/ibnms/common/easyui.jsp" %>
<%@include file="/WEB-INF/ibnms/common/ztree.jsp" %>
<html style="height:100%;overflow:hidden;">
	<head>
		<title><s:property value="filter.PROJECT_NAME" />
		</title>
		<s:set id="type" value="#parameters.type[0]"/>
	</head>
	<input type="hidden" name="DEPT_NAME" id="DEPT_NAME" value='${deptForm.deptName}'/>
	<input type="hidden" name="DEPT_ID" id="DEPT_ID" value='${deptForm.deptId}'/>
	
	<script type="text/javascript">
		var $layout = $("#layout");
		var $zTreeObj;
		$(document).ready(function(){
			/*如果使用layout，需要使用下面的脚本对布局进行自适应*/
			$zTreeObj = $.fn.zTree.init($("#deptManageTree"), 
			{	
				treeId:"id",
				data: {
					key:{
                           name:'name',
                           title:'name',
                           id:'id'
                       },
                       simpleData:{
                           idKey:'id'
                       }				
				},
				async:{
					enable:true,
					type:"post",
					dataType:"json",
					autoParam:["id=node.id"],
					url:"loadDeptTreeNodeBySuperNodeId.do"
				},
				view: {
					fontCss: function (treeId, treeNode) {
						return (!!treeNode.highlight) ? {color:"#A60000", "font-weight":"bold"} : {color:"#333", "font-weight":"normal"};
					},
					dblClickExpand:true
				},
				callback:{
					onNodeCreated:function(event, treeId, treeNode){
						if(treeNode.pId == null || treeNode.pId == 'null'){
							treeNode.pId = 'deptTree';
						}
						return treeNode;
					},
					onClick:function(event, treeId, treeNode, clickFlag){
						$("iframe[name='deptDisplayFrame']").attr("src","loadDeptList.do?&type=${type}&deptForm.SUPER_DEPT_ID="+$(treeNode).attr("id"));
						$layout.layout("resize");
					},
					onAsyncSuccess:function(event, treeId, treeNode, msg){
						treeNode.pId='deptTree';
						/*if(msg[0].pId==null||msg[0].pId=='null'){
							var firstNode = $zTreeObj.getNodeByParam('id',msg[0].id,null);
							$(firstNode).click();
							$zTreeObj.selectNode(firstNode,false);
						}*/
						return treeNode;
					}
				}
			}, 
			[{"name":$("#DEPT_NAME").val(), id:$("#DEPT_ID").val() ,pId:$("#DEPT_ID").val()}]);
		});
		
		$.ajax({
			type:"post",
			url:"loadDeptTreeNodeBySuperNodeId.do",
			dataType:"json",
			success:function(msg){
				var rootNodeObj = $zTreeObj.getNodeByParam("id",$("#DEPT_ID").val(),null);
				$zTreeObj.addNodes(rootNodeObj,msg,false);
				var nodeName = encodeURI(encodeURI($(rootNodeObj).attr("name")));
				$("iframe[name='deptDisplayFrame']").attr("src","loadDeptList.do?deptForm.SUPER_DEPT_ID="+$("#DEPT_ID").val()+"&type=${type}");
				$zTreeObj.selectNode(rootNodeObj,false);
			}
		});
		
		function refreshNode(){
			var nodes = $zTreeObj.getSelectedNodes();
			if (nodes.length>0) {
				if(nodes[0].isParent){
					$zTreeObj.reAsyncChildNodes(nodes[0], "refresh");
				}else{
					$zTreeObj.reAsyncChildNodes(nodes[0].getParentNode(), "refresh");
				}
			}

		}
	</script>
<body style="height:100%;">
	<div class="easyui-layout" id="layout" style="width:100%" fit="true">
		<div data-options="region:'west',fit:false,split:false,minWidth:100" style="width:200px">
			<ul id="deptManageTree" class="ztree" style="width:95%; height:98%; overflow:auto;"></ul>
		</div>
		<div data-options="region:'center'" style="width:100%;border-right: 0px">
			<iframe name="deptDisplayFrame" width="100%" height="100%" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" ></iframe>
		</div>
	</div>
</body>
</html>
